Component({
    properties: {},
    data: {
        images: []
    },
    methods: {
        onLoad() {
            wx.showLoading({
                title: '加载中',
                mask: true
            })
            this.getData()
        },
        getData() {
            // 细节1：将这个 showLoading 放在这里，那每次发起网络请求的时候就会显示，很不好看，我只需要页面刚进来的时候显示就行了
            // 所以将它移动到 onLoad 函数里就行了
            /*wx.showLoading({
                title: '加载中',
                mask: true
            })*/
            const that = this
            wx.request({
                url: 'https://api.thecatapi.com/v1/images/search?limit=2',
                success(res) {
                    console.log(res.data)
                    let images = that.data.images
                    let newImages = images.concat(res.data)
                    that.setData({
                        images: newImages
                    })
                    wx.stopPullDownRefresh() // 停止下拉刷新
                },
                complete(res) {
                    // 这个函数代表着网络请求完后的处理回调：不管是 success 还是 fail都会触发的
                    wx.hideLoading() // 隐藏掉 onload 动画
                    wx.hideNavigationBarLoading()
                }
            })
        },
        // 监听用户下拉动作
        onPullDownRefresh() {
            // 下拉的时候先把之前的数据清空掉
            this.setData({
                images: []
            })
            this.getData()
        },
        // 监听用户上拉触底事件
        onReachBottom() {
            wx.showNavigationBarLoading()
            this.getData()
        }
    }
});
